<style>
/*订单显示*/
.item{ width:100px; height:165px; border:1px solid #ccc; padding:5px;border-radius:5px;float:left;margin:5px;}
.item .tags{width:20px;float:left;text-align:center;}
.item .pic{width:80px; float:right;text-align:center;}
.item .pic img{max-width:80px; max-height:80px;border-radius:5px;}
.item .text{text-align:center;clear:both;}
.clear{clear:both;}
.mg10{margin:10px;}
</style>

<form class="layui-form layui-form-pane">
	<div class="layui-form-item">
		<div class="layui-inline">
			<label class="layui-form-label">下单日期</label>
			<div class="layui-input-inline">
				<input type="text" name="create_date" readonly="" id="create_date" lay-verify="" placeholder="选择下单日期" class="layui-input">
			</div>
		</div>
	</div>
</form>

<div id="view"><img src="/static/mp/image/loading.gif"></div>

<script id="tpl" type="text/html">
<div class="layui-collapse">
			
	{{#  if(d.caigou_orders > 0){ }}
		<div class="layui-colla-item caigou">
			<h2 class="layui-colla-title">采购 - {{ d.caigou_orders }}单 - {{ d.caigou_items }}件</h2>
			<div class="layui-colla-content layui-show">
					
				{{#  layui.each(d.caigou, function(kkk, vvv){ }}
					<div class="item layui-anim layui-anim-rotate">
						<div class="tags">{{ vvv.tags }}</div>
						<div class="pic"><img src="{{ vvv.pic }}" class="lay-pic"></div>
						<div class="text">
						{{# if(vvv.exception != ''){ }}
						<img src="/static/mp/image/warn.png" title="{{ vvv.exception }}">
						{{# } }}
						<span class="copy-item">{{ vvv.client_ordernum }}</span><br>{{ vvv.quantity }}件<br>{{ vvv.shipment_time }}<br>{{ vvv.factory_outgo_name }}</div>
					</div>
				{{#  }); }}

				<div class="clear"></div>
			</div>
		</div>
	{{#  }else{ }}
	<div class="mg10"><i class="layui-icon layui-icon-face-cry red"></i>暂无数据</div>
	{{#  } }}

</div>
</script>

{include file="system@block/layui" /}

<script>
	layui.use([ 'element', 'layer', 'laytpl', 'laydate', 'tool'], function() {
		var element = layui.element;
		var layer = layui.layer;
		var $ = layui.jquery;
		var form = layui.form;
		var laytpl = layui.laytpl;
		var laydate = layui.laydate;
		
		laydate.render({
		    elem: '#create_date'
	    	,theme: 'molv'
		    ,mark: {'{:$today}':''}
	    	,done: function(value, date){
	    		getOrders();
            }
		});
		//element.init();
		
     	// 获取订单
		getOrders();
		function getOrders(){
			var date = $('#create_date').val();
			$('#view').html('<img src="/static/mp/image/loading.gif">');
			$.ajax({
			   type: "POST",
			   url: "{:url('mp/purchasing/panel')}",
			   data: "date="+date,
			   dataType:"json",
			   success: function(res){
				   var Tpl = $('#tpl').html();
				   laytpl(Tpl).render(res.data, function(html){
				   		$('#view').html(html);
				   });
				   
				   element.init();
			   }
			});
		}
		
	});
</script>